import { defineConfig } from "vite"
import { resolve } from "path"

import vue from "@vitejs/plugin-vue"
import progress from "vite-plugin-progress"
import { visualizer } from "rollup-plugin-visualizer"
import viteCompression from "vite-plugin-compression"
import legacy from "@vitejs/plugin-legacy"
import AutoImport from "unplugin-auto-import/vite"
import WindiCSS from "vite-plugin-windicss"
import eslintPlugin from "vite-plugin-eslint"
import prismjs from "vite-plugin-prismjs"


//配置环境变量
const env = {
  dev: "http://192.168.62.30",
  test: "http://192.168.62.30",
  prod: "http://baidu.com",
}
const curEvn = env["dev"]

// https://vitejs.dev/config/
export default defineConfig({
  // 生产环境路径，类似webpack的assetsPath
  base: "/fvue",

  css: {
    // css预处理器
    preprocessorOptions: {
      less: {
        javascriptEnabled: true,
        additionalData: `@import "${resolve(__dirname, "src/styles/config.less")}";`

      },
    },
  },


  //插件集合
  plugins: [
    vue(),

    // 打包进度
    progress(),

    //注意这里要设置为true，否则无效
    visualizer({
      open: true,
      gzipSize: true,
    }),

    // 打包分析
    viteCompression({
      deleteOriginFile: false,
      algorithm: "gzip",
    }),

    //低版本浏览器支持
    legacy({
      targets: ["defaults", "not IE 11"],
    }),

    //配置完成之后使用ref reactive watch 等 无须import 导入 可以直接使用
    AutoImport({
      imports: ["vue", "vue-router"], // 自动导入vue和vue-router相关函数
      dts: "src/auto-import.d.ts", // 生成 `auto-import.d.ts` 全局声明
      eslintrc: {
        enabled: false, //已存在文件设置默认 false，需要更新时再打开，防止每次更新都重新生成
        filepath: "./.eslintrc-auto-import.json",  //生成文件地址和名称
        globalsPropValue: true,
      }
    }),

    //在线调试css
    WindiCSS(),

    //eslint 配置
    eslintPlugin({
      include: ["src/**/*.ts", "src/**/*.vue", "src/*.ts", "src/*.vue"],
      exclude: ["./node_modules/**"],
      cache: false
    }),
  ],
  resolve: {
    alias: {
      "@": resolve(__dirname, "./src"),
      "@components": resolve(__dirname, "./src/components"),
    },
    extensions: [".js", ".jsx", ".ts", ".tsx", ".vue", ".json"],
  },
  //本地服务器配置
  server: {
    hmr: true, //开启热更新
    open: true,
    host: "0.0.0.0",
    cors: false,
    port: 8000,
    proxy: {
      "/api": {
        target: "https://www.jianshu.com",
        changeOrigin: true,
        rewrite: path => path.replace(/^\/api/, ""),
      },
      "/portal": {
        target: `${curEvn}:8084`,
        changeOrigin: true,
        rewrite: path => path.replace(/^\/portal/, ""),
      },

      "/virtualization": {
        target: `${curEvn}:8091`,
        changeOrigin: true,
        rewrite: path => path.replace(/^\/virtualization/, ""),
      },
    },
  },

  // 打包配置
  build: {
    target: "modules", //设置最终构建的浏览器兼容目标  //es2015(编译成es5) | modules
    assetsDir: "assets", // 静态资源得存放路径文件名  assets
    outDir: "fvue", // 生产环境路径，类似webpack的assetsPath
    sourcemap: false, //构建后是否生成 source map 文件
    minify: "terser", // 项目压缩 :boolean | 'terser' | 'esbuild'

    //正式环境：清除console和debugger
    terserOptions: {
      compress: {
        drop_console: true,
        drop_debugger: true,
      },
      output: {
        comments: true, //去掉注释内容
      },
    },
    rollupOptions: {
      input: {
        index: resolve(__dirname, "index.html"),
      },
      output: {
        chunkFileNames: "static/js/[name]-[hash].js",
        entryFileNames: "static/js/[name]-[hash].js",
        assetFileNames: "static/[ext]/name-[hash].[ext]",
      },
    },
    chunkSizeWarningLimit: 1000, //最大的chunk
  },

  // 引入第三方的配置
  optimizeDeps: {
    include: [],
  },
})
